<template>
  <node
    :title="config.name"
    :show-error="showError"
    :content="content"
    :error-info="errorInfo"
    @selected="$emit('selected')"
    @delNode="$emit('delNode')"
    @insertNode2="type => $emit('insertNode', type)"
    placeholder="请设置延时时间"
    header-bgc="#f25643"
    header-icon="el-icon-time"
  />
</template>

<script setup name="DelayNode" lang="ts">

import {computed, ref} from "vue";

const props = defineProps({
  config: {
    type: Object,
    default: () => {
      return {};
    }
  }
});

const config = ref(props.config);

const errorInfo = ref<string>("");

const showError = ref(false);

const content = computed(() => {
  if (config.value.props.type === "FIXED") {
    return `等待 ${config.value.props.time} ${getName(config.value.props.unit)}`;
  } else if (config.value.props.type === "AUTO") {
    return `至当天 ${config.value.props.dateTime}`;
  } else {
    return '';
  }
});

const validate = () => {
  showError.value = false;
  try {
    if (config.value.type === "AUTO") {
      if ((config.value.datetime || "") === "") {
        showError.value = true;
        errorInfo.value = "请选择时间点";
      }
    } else {
      if (config.value.time <= 0) {
        showError.value = true;
        errorInfo.value = "请设置延时时长";
      }
    }
  } catch (e) {
    showError.value = true;
    errorInfo.value = "配置出现问题";
  }
  return !showError.value;
};

const getName = (unit: string) => {
  switch (unit) {
    case "D":
      return "天";
    case "H":
      return "小时";
    case "M":
      return "分钟";
    default:
      return "未知";
  }
};
// 导出方法
defineExpose({validate})
</script>

<style scoped></style>
